<div ng-controller="iconCtrl" style="display: table;width: 100%">
    <div style="width:140px;display: table-cell;">
        <!--style="overflow-y: auto;overflow-x: hidden"-->
        <div  id="folderScroll">
            <ul >
                <li ng-repeat="type in typeList" style="position: relative">
                    <form novalidate name="form">
                        <button ng-show="!type.edit" ng-click="selectType(type)" class="btn btn-default nameBtn" ng-class="{'active':type.active}" >{{type.text}}</button>
                        <input ng-show="type.edit" uib-tooltip="{{!type.textCopy?'不可为空':(form.textCopy.$invalid?'有重名':null)}}"
                               ensure-unique="iconType"
                               type="text" ng-model="type.textCopy" name="textCopy" class="form-control" required style="margin-bottom: 5px;"/>
                        <div class="absDiv hoverShow" ng-show="!type.edit" ng-if="$root.hasPower('编辑图标夹')">
                            <button  class="btn btn-default roundBtn" ng-click="editType(type)" title="编辑"><i class="glyphicon glyphicon-pencil"></i></button>
                            <button  class="btn btn-danger roundBtn" ng-click="delType(type)" title="删除"><i class="glyphicon glyphicon-remove"></i></button>
                        </div>
                        <div class="absDiv" ng-show="type.edit">
                            <button  class="btn btn-primary roundBtn" ng-click="saveType(form,type)" title="保存"><i class="glyphicon glyphicon-ok"></i></button>
                            <button  class="btn btn-default roundBtn" ng-click="cancelEdit(type)" title="撤消"><i class="fa fa-undo"></i></button>
                        </div>
                    </form>
                </li>
                <li class="text-center" ng-if="$root.hasPower('编辑图标夹')">
                    <button class="btn btn-primary roundBtn" ng-click="typeList.push({edit:true})"><i class="glyphicon glyphicon-plus"></i></button>
                </li>
            </ul>
        </div>
    </div>
    <div style="padding-left: 15px" ng-style="{visibility:curType?'visible':'hidden'}">
        <div class="x_panel" >
            <div class="form-inline">
                <div class="form-group">
                    <label>名称 </label>
                    <input type="text" ng-model="search.name"  class="form-control" />
                </div>
                <div class="form-group">
                    <label>
                    <input type="checkbox" ng-model="search.repeatName" ng-true-value=1 ng-false-value=2  style="vertical-align: text-bottom;" />
                    筛选重名 </label>
                </div>
                <button class="btn btn-primary" ng-click="findImage(1);findSprite(1)" >查询</button>
                <button class="btn btn-default" ng-click="search.name=''" >重置</button>

                <button class="btn btn-default pull-right" ng-if="$root.hasPower('下载图标')" ng-disabled="!hasChecked(iconTypes[0].pageModel.data) && !hasChecked(iconTypes[1].pageModel.data)"  ng-click="downloadZip()">下载</button>
                <button class="btn btn-danger pull-right mr10"  ng-if="$root.hasPower('编辑图标')" ng-disabled="!hasChecked(iconTypes[0].pageModel.data) && !hasChecked(iconTypes[1].pageModel.data)" ng-click="delAll()">批量删除</button>
                <button class="btn btn-info pull-right mr10" ng-if="$root.hasPower('编辑图标')" ng-disabled="!hasChecked(iconTypes[0].pageModel.data) && !hasChecked(iconTypes[1].pageModel.data)"  ng-click="editAll()">修改</button>
                <button class="btn btn-primary pull-right mr10" ng-if="$root.hasPower('编辑图标')" ng-click="addPhotos({'folderId':curType.id})" >添加</button>
            </div>
        </div>
        <div class="row" >
            <!--<h5 class="col-xs-12">
             <span role="button" class="btn-link " style="margin-right: 5px;" ng-click="checkAll(curType.pageModel.data)">
              <i class="glyphicon" ng-class="{'glyphicon-check':allChecked(iconTypes[0].pageModel.data) && allChecked(iconTypes[1].pageModel.data),'glyphicon-unchecked':!allChecked(iconTypes[0].pageModel.data)||!allChecked(iconTypes[1].pageModel.data)}"></i>全选</span>
              <span role="button" class="btn-link" ng-click="unCheckAll(iconTypes[0].pageModel.data)&&unCheckAll(iconTypes[1].pageModel.data)" ng-show="hasChecked(iconTypes[0].pageModel.data)|| hasChecked(iconTypes[1].pageModel.data)">
              <i class="glyphicon glyphicon-ban-circle" ></i>取消选中</span>
            </h5>-->
            <div class="col-xs-6" ng-repeat="curType in iconTypes">
                <div class="panel panel-default "  >
                    <div class="panel-heading text-center" >
								<span role="button" class="btn-link pull-left" style="margin-right: 5px;" ng-click="checkAll(curType.pageModel.data)">
								<i class="glyphicon" ng-class="{'glyphicon-check':allChecked(curType.pageModel.data),'glyphicon-unchecked':!allChecked(curType.pageModel.data)}"></i>全选</span>
                        <span role="button" class="btn-link pull-left" ng-click="unCheckAll(curType.pageModel.data)" ng-show="hasChecked(curType.pageModel.data)">
								<i class="glyphicon glyphicon-ban-circle" ></i>取消选中</span>
                        图标类型：{{curType.name}}
                        <button class="btn btn-info pull-right" ng-if="$root.hasPower('编辑图标')" ng-disabled="!hasChecked(curType.pageModel.data)" ng-click="shiftType(curType)">变更类型</button>

                    </div>
                    <div class="panel-body iconScroll" >
                        <p ng-if="curType.pageModel.data.length == 0" class="text-center">暂无图标</td></p>
                        <div class="clearfix">
                            <div class="photoWraper"  ng-repeat="ic in curType.pageModel.data">
                                <div ng-click="showPhoto(ic.path)">
                                    <img onerror="javascript:this.src='images/detail.png';"
                                         ng-src="{{processImgUrl(ic.path,'min')}}" > <!--//-->
                                </div>
                                <label role="button"  uib-tooltip="{{ic.name}}" ng-style="{'background-color':ic.checked?'#5bc0de':'dark'}" style="word-break: break-all;" ng-click="checkOne(ic,curType.pageModel)"><i  ng-class="{'glyphicon-check':ic.checked,'glyphicon-unchecked':!ic.checked}" class="glyphicon"></i>
                                    {{ic.name}}</label>
                            </div>
                        </div>
                        <div class="clearfix" >
                            <page find="$index ==0?findImage:findSprite" page-model="curType.pageModel"></page>
                        </div>
                    </div>
                </div>
            </div>
        </div>

       <!-- <div class="panel panel-default">
            <div class="panel-heading">
                <span role="button" class="btn-link " style="margin-right: 5px;" ng-click="checkAll(curType.pageModel.data)">
                <i class="glyphicon" ng-class="{'glyphicon-check':allChecked(curType.pageModel.data),'glyphicon-unchecked':!allChecked(curType.pageModel.data)}"></i>全选</span>
                <span role="button" class="btn-link" ng-click="unCheckAll(curType.pageModel.data)" ng-show="hasChecked(curType.pageModel.data)">
                <i class="glyphicon glyphicon-ban-circle" ></i>取消选中</span>

                <button class="btn btn-primary pull-right" ng-click="addPhotos(curType.pageModel,{'folderId':curType.id,'multiple':true })" >添加</button>
                <button class="btn btn-danger pull-right" ng-disabled="!hasChecked(curType.pageModel.data)" ng-click="delAll()">批量删除</button>
                <button class="btn btn-info pull-right" ng-disabled="!hasChecked(curType.pageModel.data)" ng-click="editAll()">修改</button>
                <button class="btn btn-default pull-right" ng-disabled="!hasChecked(curType.pageModel.data)" ng-click="downloadZip()">下载</button>
            </div>
            <div class="panel-body" id="iconScroll">
                <p ng-if="curType.pageModel.data.length == 0" class="text-center">暂无图标</td></p>
                <div class="clearfix">
                    <div class="photoWraper"  ng-repeat="item in curType.pageModel.data">
                        <div ng-click="showPhoto(item.path)">
                            <img onerror="javascript:this.src='images/detail.png';"
                                 ng-src="{{processImgUrl(item.path,'min')}}" >
                        </div>
                        <label role="button" ng-style="{'background-color':item.checked?'#5bc0de':'dark'}" style="word-break: break-all;" ng-click="checkOne(item,curType.pageModel)"><i  ng-class="{'glyphicon-check':item.checked,'glyphicon-unchecked':!item.checked}" class="glyphicon"></i>
                            {{item.name}}</label>
                    </div>
                </div>
                <div class="clearfix" >
                    <ng-include src="'common/pager.html'"></ng-include>
                </div>
            </div>
        </div>-->
    </div>
</div>
<style>
    .nameBtn{
        width: 140px;
        margin-bottom: 5px;
        position: relative;
        white-space:normal;
        word-break: break-word;
    }
    .absDiv{
        position: absolute;
        top: 5px;
        right: 8px;
        z-index: 2;
        right: -50px;
    }
    .hoverShow{
        display: none;
    }
    li:hover .hoverShow{
        display: block;
    }
    .roundBtn {
        padding: 4px;
        border-radius: 15px;
        line-height: 14px;
    }
    .nameBtn.active{
        box-shadow: inset 0 3px 5px rgba(0,0,0,.5)
    }
    .iconScroll{
        overflow-y: scroll;
    }
</style>